import React, { Component } from 'react';
import Entr from './Entr';

class Entrance extends Component {
    constructor(props){
        super(props);
        this.state={
           
          EntranceList:[
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/799597c07f8574de703294229d90e570_400x400.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/6a555f13ab2899114a07752a08ab7b90_400x400.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/f2cc1ca9902d1df6b8b6ce8032443b5d_400x400.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/601/603/225510/228586/228596/279787_1_pic400_449.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/f2cc1ca9902d1df6b8b6ce8032443b5d_400x400.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/6a555f13ab2899114a07752a08ab7b90_400x400.jpg",
                text: "商品"
            },
    
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/799597c07f8574de703294229d90e570_400x400.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/601/603/225510/228586/228593/269197_4_pic400_8359.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/e452c2205610f2612a58ce0534cf5170_400x400.jpg",
                text: "商品"
            },
            {
                icon: "https://pic.cdfgsanya.com/assets/upload/product/601/603/225510/228586/228593/269197_4_pic400_8359.jpg",
                text: "商品"
            }
        ],
        }
    }
    
    render() {
        return (
            <div className="entrance">
                {
                this.state.EntranceList.length > 0 ? this.state.EntranceList.map((item, index) => {
                    return (
                        <Entr key={index} item={item}></Entr>
                    )
                }) : <div className="entrance">数据请求中...</div>}
            </div>
        );
    }
}


export default Entrance;